<template>
  <div class="d-art bg-w m-t-1">
    <header class="header">
      {{ name }} <span v-if="item.code === 1">赞了这篇文章</span>
      <span v-else>发布了这篇文章</span>
    </header>
    <div class="wrap-header">
      <DHeader :id="item.header.articleId" :time="item.header.time"></DHeader>
    </div>
    <DBody :body="item.body"></DBody>
    <AboutArticle
      :aboutArticle="item.aboutArt"
      v-if="item.code === 1"
    ></AboutArticle>
  </div>
</template>

<script>
import DHeader from "@/components/article-detail/articleDetail/Header";
import DBody from "@/components/user/userDetail/userDynic/navMenu/Dynic/DBody";
import AboutArticle from "@/components/user/userDetail/userDynic/navMenu/Dynic/AboutArticle";
import { getSessionStorage, parse } from "@/utils/utils/";
export default {
  name: "DArt",
  components: {
    DHeader,
    DBody,
    AboutArticle,
  },
  props: {
    item: {
      type: Object,
      default: () => ({}),
    },
  },
  data() {
    return {
      name: "",
    };
  },
  created() {
    const info = getSessionStorage("cid");
    if (info) {
      let { isUser } = parse(info);
      this.name = isUser ? this.$store.state.user.username : "";
    } else {
      this.$bus.$on("getUsername", (name) => {
        this.name = name;
      });
    }
  },
};
</script>

<style lang='scss' scoped>
.d-art {
  .header {
    padding: 1.5rem;
    font-size: 1.3rem;
    border-bottom: 1px solid #eaeaea;
    span {
      color: #8a9aa9;
    }
  }
  &:nth-of-type(1) {
    margin-top: 0;
  }
  .wrap {
    padding: 2rem;
  }
  .wrap-header {
    padding: 2rem 2rem 0 2rem;
  }
}
</style>
